﻿@{
    Layout = "";
}
<style>
    .ngdialog.ngdialog-theme-plain .ngdialog-content {
        width: 25% !important;
    }
</style>
<h3>秒杀活动</h3>

<div class="panel panel-default" ng-controller="SpikeActivityController" ng-class="{ 'whirl standard': isLoading }">
    <div class="panel-heading">
        <div class="form-inline ng-pristine ng-valid">
            <div class="form-group">
                <input placeholder="关键字" class="form-control" type="text" ng-model="Keywords">
                <p class="input-group" style="margin-top:10px">
                    <input readonly="readonly" placeholder="开始时间(最小时间)" style="z-index: 0;" type="text" class="form-control" datetime-picker="yyyy-MM-dd HH:mm" ng-model="StartTime"
                           is-open="picker1.open" datepicker-options="datepickerOptions" />
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" ng-click="openCalendar($event, 'picker1')"><i class="fa fa-calendar"></i></button>
                    </span>
                </p>
                ～
                <p class="input-group" style="margin-top:10px">
                    <input readonly="readonly" style="z-index: 0;" placeholder="开始时间(最大时间)" type="text" class="form-control" datetime-picker="yyyy-MM-dd HH:mm" ng-model="EndTime"
                           is-open="picker2.open" datepicker-options="datepickerOptions" />
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" ng-click="openCalendar($event, 'picker2')"><i class="fa fa-calendar"></i></button>
                    </span>
                </p>
                <button type="submit" class="btn btn-labeled btn-primary" ng-click="tableParams.$params.page = 1;tableParams.reload()">
                    <span class="btn-label">
                        <em class="fa fa-search"></em>
                    </span>搜索
                </button>
            </div>
            <div class="form-group">
                <button type="submit" class="btn btn-labeled btn-success" ng-click="UpdateSpikeActivityView(0)">
                    <span class="btn-label">
                        <em class="fa fa-plus"></em>
                    </span>新增
                </button>
            </div>
        </div>
    </div>
    <div class="panel-body">
        <div class="table-responsive">
            <table ng-table="tableParams" class="table table-striped table-bproducted table-hover">
                <tbody>
                    <tr ng-repeat="activity in $data">
                        <td data-title="'活动海报'" class="text-center">
                            <img ng-src="{{ImgHostUrl + activity.HeadPicUrl}}" style="max-width: 100px; max-height: 100px" onerror="javascript: this.src = '/Content/img/default.png';" />
                        </td>
                        <td data-title="'活动名称'" class="text-center">{{activity.Name}}<br />{{activity.SubTitle}}</td>
                        <td data-title="'活动时间'" sortable="'BeginTime'" class="text-center">{{activity.BeginTime + '至'}}<br />{{activity.EndTime}}</td>
                        <td data-title="'已售/总量'" class="text-center">{{activity.TotalSpikeStock + '/' + activity.TotalStock}}</td>
                        <td data-title="'创建时间'" sortable="'AddTime'" class="text-center">{{activity.AddTime}}</td>
                        <td data-title="'活动状态'" class="text-center">
                            <div ng-class="{ 'label label-success': activity.ActivityState == '进行中','label label-warning': activity.ActivityState != '进行中' }">
                                {{activity.ActivityState}}
                            </div>
                        </td>
                        <td data-title="''" nowrap="nowrap" class="text-center">
                            <button type="button" ng-click="UpdateSpikeActivityView(activity.Id)" class="btn btn-sm btn-edit" title="编辑">
                                <em class="fa fa-edit"></em>
                            </button>
                            <button type="button" ng-click="changeState(activity)" class="btn btn-sm btn-info" title="{{activity.ActivityState == '进行中' ? '关闭活动' : '开启活动'}}"
                                    ng-if="activity.ActivityState != '已结束'">
                                <em ng-class="{ 'fa fa-toggle-on': activity.ActivityState == '进行中' ,'fa fa-toggle-off': activity.ActivityState != '进行中' }"></em>
                            </button>

                            <button type="button" ng-click="SetTimeDelay(activity.Id)" class="btn btn-sm btn-edit" title="活动延迟" ng-if="activity.ActivityState == '已结束'">
                                <em class="icon-speedometer"></em>
                            </button>
                            <button type="button" ng-click="removeActivity($index,activity)" class="btn btn-sm btn-danger" title="删除">
                                <em class="fa fa-trash-o"></em>
                            </button>

                        </td>

                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <script type="text/ng-template" id="deleteConfirmDialog">
        <div class="ngdialog-message text-center">
            <h3>确定要删除吗?</h3>
            <p>删除后不可恢复!</p>
            <br />
            <button type="button" ng-click="confirm()" class="btn btn-primary mr">确认</button>
            <button type="button" ng-click="closeThisDialog('button')" class="btn btn-default">取消</button>
        </div>
    </script>
    <script type="text/ng-template" id="confirmChangeStateDialogId">
        <div class="ngdialog-message text-center">
            <h3>确认提前{{TipText}}该活动吗</h3>
            <br />
            <button type="button" ng-click="confirm()" class="btn btn-primary mr">确认</button>
            <button type="button" ng-click="closeThisDialog('button')" class="btn btn-default">取消</button>
        </div>
    </script>
    <script type="text/ng-template" id="setTimeDelyDialogId">
        <div class="ngdialog-message text-center">
            <fieldset>
                <div class="form-ingroup">
                    <label class="col-sm-3 control-label">活动延长至</label>
                    <div class="col-sm-8">
                        <p class="input-group">
                            <input readonly="readonly" style="z-index: 0;" placeholder="活动结束时间" type="text" class="form-control" datetime-picker="yyyy-MM-dd HH:mm" ng-model="SetTimeDely.EndTime"
                                   is-open="picker3.open" datepicker-options="datepickerOptions" />
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-default" ng-click="openCalendar($event, 'picker3')"><i class="fa fa-calendar"></i></button>
                            </span>
                        </p>
                    </div>
                </div>
            </fieldset>
            <button type="button" ng-click="confirmDely()" class="btn btn-primary mr">确认</button>
            <button type="button" ng-click="closeDelyDialog('button')" class="btn btn-default">取消</button>
        </div>
    </script>
</div>
<script>
    App.controller('SpikeActivityController', [
    '$scope', '$resource', '$state', '$route', 'ngDialog', '$http', 'ngTableParams', 'ngTableDataService', 'Notify',
    function ($scope, $resource, $state, $route, ngDialog, $http, ngTableParams, ngTableDataService, Notify) {
        'use strict';

        $scope.tableParams = new ngTableParams({
            page: 1,
            count: 10,
            sorting: {
                Id: 'desc'     // 初始化排序
            }
        }, {
            getData: function ($defer, params) {
                $scope.isLoading = true;
                var requestParams = {
                    Skip: (params.page() - 1) * params.count(),
                    Take: params.count(),
                    Keywords: $scope.Keywords,
                    StartTimeParm: $scope.StartTime,
                    EndTimeParm: $scope.EndTime
                };
                $http.post('/Activity/SpikeManage', ngTableDataService.getServerSideParams(params.orderBy().toString(), params, requestParams))
                    .success(function (data, status) {
                        params.total(data.Total);
                        $defer.resolve(data.Results);
                        $scope.isLoading = false;
                    });
            }
        });

        //删除限时抢购
        $scope.removeActivity = function (index, activity) {
            ngDialog.openConfirm({
                template: 'deleteConfirmDialog',
                className: 'ngdialog-theme-default'
            }).then(function (value) {
                $http.post("/Activity/DelSpike", { Id: activity.Id }).then(function (returnData) {
                    if (returnData.data.isSuccess) {
                        $scope.tableParams.data.splice(index, 1);
                        Notify.alert('操作成功!', { status: 'success', timeout: 1000 });
                    } else {
                        Notify.alert(returnData.data.msg, { status: 'warning', timeout: 1000 });
                    }
                });
            }, function (reason) {
            }
            );
        }

        //改变状态
        $scope.changeState = function (activity) {
            $scope.TipText = activity.ActivityState === '进行中' ? "结束" : "开始";
            ngDialog.openConfirm({
                template: 'confirmChangeStateDialogId',
                className: 'ngdialog-theme-default',
                scope: $scope
            }).then(function (value) {
                $http.post("/Activity/ChangeSpikeState", { Id: activity.Id }).then(function (returnData) {
                    if (returnData.data.isSuccess) {
                        var returnActivity = JSON.parse(returnData.data.msg);
                        activity.BeginTime = returnActivity.BeginTime;
                        activity.EndTime = returnActivity.EndTime;
                        activity.ActivityState = returnActivity.ActivityState;
                        Notify.alert('操作成功!', { status: 'success', timeout: 1000 });
                    } else {
                        Notify.alert(returnData.data.msg, { status: 'warning', timeout: 1000 });
                    }
                });
            }, function (reason) {
            });
        }
        //延迟活动时间
        $scope.SetTimeDelay = function (id) {
            $scope.tempActivityId = id;
            $scope.SetTimeDely = {};
            ngDialog.openConfirm({
                template: 'setTimeDelyDialogId',
                className: 'ngdialog-theme-plain',
                scope: $scope
            }).then(function (value) { }, function (reason) { });
        }
        //取消延迟操作
        $scope.closeDelyDialog = function () {
            ngDialog.closeAll();
        }
        //确认延迟操作
        $scope.confirmDely = function () {
            if ($scope.SetTimeDely.EndTime == null) {
                Notify.alert('请填写延长结束时间!', { status: 'warning', timeout: 1000 });
                return false;
            }
            $http.post("/Activity/ChangeSpikeEndTime", { EndTime: $scope.SetTimeDely.EndTime, Id: $scope.tempActivityId }).then(function (returnData) {
                if (returnData.data.isSuccess) {
                    Notify.alert('操作成功!', { status: 'success', timeout: 1000 });
                    $scope.tableParams.reload();
                    ngDialog.closeAll();
                } else {
                    Notify.alert(returnData.data.msg, { status: 'warning', timeout: 1000 });
                }
            });
        }

        //跳转更新新增页面
        $scope.UpdateSpikeActivityView = function (id) {
            $state.go('app.spikeEdit', { "Id": id });
        }

        // 日期插件
        $scope.picker1 = {
            date: new Date()
        };

        $scope.picker2 = {
            date: new Date()
        };
        $scope.picker3 = {
            date: new Date()
        };
        $scope.datepickerOptions = {
            showWeeks: false,
            startingDay: 1,
            dateDisabled: function (data) {
                //return (data.mode === 'day' && (new Date().toDateString() == data.date.toDateString()));
            }
        }

        $scope.openCalendar = function (e, picker) {
            $scope[picker].open = true;
        };
    }
    ]);
</script>
